<template>
  <view class="main">
    <view v-if="likeList.length > 0">
      <view
        class="likeList flex_between_center"
        v-for="(item, index) in likeList"
        :key="index"
        @click="goCheck(item)"
      >
        <view class="flex_between_center">
          <view
            @click.prevent.stop="
              go('/pages/my/homeCenter/taHome?id=' + item.other_uid)
            "
          >
            <u-avatar
              :src="item.avatar"
              mode="aspectFill"
              size="104rpx"
            ></u-avatar>
          </view>
          <view class="content">
            <view class="name">{{ item.uername }}</view>
            <view class="time">
              赞了你的
              <template v-if="item.type == 2">回答</template>
              <template v-if="item.type == 8">评论</template>
              {{ item.updatetime }}
            </view>
          </view>
        </view>
        <u-icon name="arrow-right" color="#999999" size="36rpx"></u-icon>
      </view>
    </view>
    <view class="empty" v-if="likeList.length == 0 && isLoading == false">
      <u-empty
        text="暂无数据"
        width="200"
        icon="/static/img/empty.png"
        textColor="#999"
      >
      </u-empty>
    </view>
  </view>
</template>

<script
  type="text/javascript"
  src="plus-confusion://../pages/message/like/index"
></script>

<style lang="scss">
page {
  background: #fff;
}

.main {
  min-height: 90vh !important;
  position: relative;
  .likeList {
    display: flex;
    align-items: center;
    margin-bottom: 20rpx;
    padding: 50rpx 30rpx;

    &:not(:last-child) {
      border-bottom: 1rpx solid #dedede;
    }

    .content {
      margin-left: 30rpx;

      .name {
        font-size: 30rpx;
        color: #333333;
        line-height: 40rpx;
      }

      .time {
        margin-top: 10rpx;
        font-size: 26rpx;
        color: #999999;
        line-height: 40rpx;
      }
    }
  }
}

/deep/.u-empty__text {
  margin-top: -100rpx !important;
}

.empty {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -150%);
}
</style>
